<div class="container">
    <!-- WRAPPER -->
    <div class="container-wrapper wrapper-bg">
        <!-- HEADER -->
        <div class="container-header"
            [style.backgroundImage]="'url('+deployUrl+'assets/img/end-year/common/bg-header.png)'">
        </div>
        <!-- MAIN -->
        <div class="container-main"
            [style.backgroundImage]="'url('+deployUrl+'assets/img/end-year/common/bg-center.png)'">
            <!-- PRIZE LIST ROWS -->
            <!-- ROW-i -->
            <div *ngFor="let row of layoutMap.get(1);" class="container-main__list">
                <!-- BLOCK-1 -->
                <div *ngFor="let block of row" class="list-item">
                    <div class="list-item--condition"
                        [style.backgroundImage]="'url('+deployUrl+'assets/img/end-year/welfare/sign-prize-condition-bg.png)'">
                        <span>累计签到{{block.index}}天</span>
                    </div>
                    <div class="list-item--content"
                        [style.backgroundImage]="'url('+deployUrl+'assets/img/end-year/welfare/sign-prize-bg-'+(detail.signInDays>=block.index ? 1:2)+'-'+block.size+'.png)'">
                        <section *ngFor="let item of block.content">
                            <!-- ITEM-1 -->
                            <div class="list-item--main">
                                <img [src]="deployUrl+'assets/img/end-year/welfare/sign-prize-'+item.pic+'.png'"
                                    class="list-item__pic" [alt]="'奖品'+item.pic">
                                <div class="list-item__name">
                                    {{item.name}}
                                </div>
                                <!-- 标签 -->
                                <div *ngIf="item.validity" class="list-item__tag"
                                    [style.backgroundImage]="'url('+deployUrl+'assets/img/end-year/welfare/sign-tag-bg.png)'">
                                    {{item.validity}}{{item.unit || '天'}}
                                </div>
                                <!-- 已获取 -->
                                <img *ngIf="detail.signInDays>=block.index"
                                    [src]="deployUrl+'assets/img/end-year/welfare/anchor-prize-got.png'" alt="已获取"
                                    class="list-item__got">
                            </div>
                        </section>
                    </div>
                </div>
            </div>
            <!-- SUBMIT -->
            <!-- -ACTIVE- -->
            <div (click)="sign()" *ngIf="!detail.todaySignIn" class="container-submit"><img
                    [src]="deployUrl+'assets/img/end-year/welfare/sign-submit-active.png'" alt="签到">
            </div>
            <!-- -INACTIVE- -->
            <div *ngIf="detail.todaySignIn" class="container-submit"><img
                    [src]="deployUrl+'assets/img/end-year/welfare/sign-submit-inactive.png'" alt="已签到"></div>
            <!-- TIPS -->
            <div class="container-tips">
                <div class="container-tips__text">
                    <p>注意事项</p>
                    <p>1、成功签到后对应的奖励将会自动下发，无需手动领取；</p>
                    <p>2、「人气票」有24小时有效期，请尽快使用；</p>
                    <p>3、若您发生奖励未到账的情况，请扫描下方二维码联系我们在线客服处理。</p>
                </div>
                <img class="container-tips__qr" [src]="deployUrl+'assets/img/end-year/common/service-qr.png'"
                    alt="客服二维码">
            </div>
            <!-- FOOTER -->
            <div class="container-footer"
                [style.backgroundImage]="'url('+deployUrl+'assets/img/end-year/common/bg-footer.png)'">
            </div>
            <!-- TIPS -->
        </div>